{extend name="common:frm_base" /}
{block name="content"}
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-header">添加开通区域</div>
        <div class="layui-card-body" style="padding: 15px;">
            <form class="layui-form" action="{:url('City/handle')}" lay-filter="component-form-group">
                <style type="text/css">
                    #test{position: absolute;max-height: 500px;height: 350px;overflow: auto;width: 100%;z-index: 123;display: none;border:1px solid silver;top: 42px;}
                    .layui-show{display: block!important;}
                </style>
                <div class="layui-form-item">
                    <label class="layui-form-label">开通区域：</label>
                    <div class="layui-input-block">
                        <div class="layui-unselect layui-form-select">
                            <div class="layui-select-title">
                                <input type="text" name="name" value="{$info['name']|default=''}" placeholder="请输入城市名称" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-card" id="test">
                            <div class="layui-card-body">
                                <div id="toolbarDiv"><ul id="slTree" class="dtree" data-id="0" style="width: 100%;"></ul></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">排序</label>
                    <div class="layui-input-inline">
                        <input type="text" name="ordid" value="{$info['ordid']|default=''}" placeholder="50" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">状态</label>
                    <div class="layui-input-inline">
                        <input type="checkbox" name="status" {if $info.status==1 }checked{/if} lay-skin="switch" value="1" lay-text="ON|OFF">
                    </div>
                </div>
                {:token()}
                <input type="hidden" name="region_id" value="{$info.region_id}" id="region_id" />
                <input type="hidden" value="{$act}" name="act" />
                <input type="hidden" value="{$info['id']|default=''}" name="id" />
                <div class="layui-form-item layui-hide">
                    <input type="button" lay-submit lay-filter="LAY-user-front-submit" id="LAY-user-front-submit" value="确认">
                </div>
                <!--<div class="layui-form-item layui-layout-admin">-->
                <!--<div class="layui-input-block">-->
                <!--<div class="layui-footer" style="left: 0;">-->
                <!--<button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">立即提交</button>-->
                <!--<button type="reset" class="layui-btn layui-btn-primary">重置</button>-->
                <!--</div>-->
                <!--</div>-->
                <!--</div>-->
            </form>
        </div>
    </div>
</div>


<script>
    layui.config({
        base: '__LAYUIADMIN__/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'dtree'], function(){
        var $ = layui.$
            ,admin = layui.admin
            ,element = layui.element
            ,layer = layui.layer
            ,form = layui.form
            ,dtree = layui.dtree;

        form.render(null, 'component-form-group');

        var DTree = dtree.render({
            elem: "#slTree",
            url: "{:url('region/ajaxIndex')}",
            dataStyle: "layuiStyle",  //使用layui风格的数据格式
            response:{message:"msg",statusCode:0},  //修改response中返回数据的定义
            icon: "2",
            accordion:true
        });

        $("#city").on("click",function(){
            $(this).toggleClass("layui-form-selected");
            $("#test").toggleClass("layui-show layui-anim layui-anim-upbit");
        });

        dtree.on("node(slTree)", function(obj){
            $("#input_city").val(obj.param.context);
            $("#region_id").val(obj.param.nodeId);
            $("#city").toggleClass("layui-form-selected");
            $("#test").toggleClass("layui-show layui-anim layui-anim-upbit");
        });

    });
</script>
{/block}